<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>学科大类</title>
    <style>
        * {
            margin: 0;
            padding: 0;
        }

        /* ----------------------------------------------------顶部导航条 ---------------------------------------------------------------------*/

        .name {
            text-decoration: none;
            color: black;
        }

        .head {
            background-color: white;
            display: flex;
            justify-content: space-around;
            padding: 40px;
            margin-left: -135px;
        }
        .nav1 {
            display: flex;
            justify-content: space-between;
        }

        .zi {
            color: #999;
        }

        .kuai {
            width: 115px;
            height: 10px;
        }

        .name:hover {
            color: #7330b7;
        }

        .zi:hover {
            color: #7330b7;
        }

        /* ----------------------------------------------------------网页搜索及小搜索图标 -----------------------------------------------------*/

        .right {
            padding: 10px;
        }
        .apply {
            text-decoration: none;
            color: black;
            cursor: pointer;
        }
        .apply:hover{background-color: white;}
        .apply2 {
            background-color: #2773e3;
            border: 1px solid #2773e3;
            border-radius: 20px;
            padding: 5px;
            margin-right: 15px;
            cursor: pointer;
        }

        .search {
            padding-left: 15px;
        }

        /* ------------------------------------------------------------------------图片上的文字学科大类及英文 ----------------------------------*/
        .s2 {
            position:absolute;
            left: 94px;
            top: 245px;
            font-size: 55px;
            color: white;
        }

        .s1 {
            position: absolute;
            left: 94px;
            top: 317px;
            font-size: 35px;
            color: white;
            font-weight: lighter;
        }

        /*------------------------------------------------------------------------------- 首页到学科大类到招生专业类------------------------------ ----*/

        .bg {
            position: absolute;
            background-color: white;
            width: 1937px;
            height: 120px;
            top: 537px;
            left: 94px;
        }

        .link8 {
            text-decoration: none;
            color: #999;
            font-size:small;
        }

        .daohang {
            display: flex;
            background-color: white;
            position: absolute;
            bottom: 63px;
            left: 35px;
            width: 1400px;
            height: 30px;
            cursor: pointer;
        }

        .xiaofangzi {
            width: 22px;
            height: 20px;
        }

        .link8:hover {
            color: #7330b7;
        }

       /* ---------------------招生专业类板块---------------------------- */

        .d1 {
            color: #7330b7;
            position: absolute;
            left: 150px;
            top: 658px;
            font-size: large;
            font-weight: lighter;
            text-decoration: none;
            border-bottom: #e2e2e2 solid 1px;
            width: 200px;
            height: 40px;
            cursor: pointer; 
        }

        .d2 {
            color: #7330b7;
            position: absolute;
            left: 495px;
            top: 658px;
            font-size: 30px;
        }

        .d3 {
            font-size: 20px;
            color:#2e414a;
            text-align:left;
            height: 71.67px;
            position: absolute;
            top:724px;
            width: 1045px;
            line-height: 35px;
        }

        /* 竖着的分割线 */
        .xin::before {
            content: "";
            display: block;
            position: absolute;
            left: 6.08rem;
            top: 648px;
            width: 4px;
            height: 40px;
            background-image: url('./紫色.webp');
        }
        /* --------------------------------主体部分，两个框------------------------------------- */
        .major{
            width: 1045px;
            height: 2000px;
            margin: auto;
        }
        .e1 {
            background-image: url('./左.jpg');
            color: #fff;
            width: 500px;
            height: 60px;
            font-size: 20px;
            margin-top: 325px;
            line-height: 60px;  
        }
        .name2:before{
            display: block;
            position: absolute;
            top: 0;
            right: 20px;
            background-image: url('https://www.join-tsinghua.edu.cn/dfiles/24262/publish/bzw2019/image/img16.jpg');
            background-size: 100%;
            width: .16rem;
            height: 100%;
        }
        .name2{
            font-size: large;
            line-height: 65px;
            height: 65px;
            width: 500px;
            cursor: pointer;
            border-bottom: #e2e2e2 solid 1px;
            background-color: white;
        }
        .name3{
            text-decoration: none;
            color: #000;
        }
        .name4{
            font-size: large;
            line-height: 65px;
            height: 65px;
            width: 500px;
            cursor: pointer;
            border-bottom: #e2e2e2 solid 1px;
            background-color:#f7f7f7;
        }
        .name2:hover{background-color:#e2e2e2;}
        .name4:hover{background-color:#e2e2e2;}
        .e2 {
            background-image: url('./右.jpg');
            color: #fff;
            width: 500px;
            height: 60px;
            line-height: 60px;
            font-size: 20px;
            margin-top: 325px;
        }
        .first{
            width: 500px;
            height: 2000px;
            float: left;
        }
        .second{
            width: 500px;
            height:2000px;
            float:right;
        }

/*------------------------------------------ 底部部分 ---------------------------------*/
        .foot {
            background-image: url('./foot.jpg');
            background-repeat: no-repeat;
            background-size: cover;
            width: 100%;
            height: 350px;
        }

        .nav {
            padding-top: 60px;
        }

        .wenzi {
            color: #fff;
            font-size: .12rem;
            line-height: 20px;
            font-family: Arial, "微软雅黑";
            margin-top: 20px;
        }

        .erweima {
            color: #fff;
            font-size: .12rem;
            font-family: Arial, "微软雅黑";
            padding-top: 60px;
        }

        .bingpai {
            display: flex;
            justify-content: space-around;
            margin-left: -306px;
        }

        .wen {
            margin-top: 20px;
        }

        .xiaofoot {
            background-image: url('./紫色小物件.jpg');
            position: relative;
            display: flex;
            justify-content: space-between;
            background-repeat: no-repeat;
            background-size: cover;
            width: 100%;
            height: 70px;
        }

        .jing {
            text-decoration: none;
            color: #fff;
            font-size: .12rem;
            font-family: Arial, "微软雅黑";
        }

        .baijing {
            color: #fff;
            font-size: .12rem;
            font-family: Arial, "微软雅黑";
            line-height: 20px;
            margin-left: 101px;
        }

        .a1 {
            text-decoration: none;
            color: #fff;
            font-size: 10px;
            font-family: Arial, "微软雅黑";
        }

        .link1 {
            margin-right: 470px;
            color: #fff;
            font-size: 10px;
            font-family: Arial, "微软雅黑";
        }
        /* -----------------------------小图标--------------------------------------- */
        .righttools {
            position: fixed;
            right: 20px;
            bottom: 30px;
            width: 60px;
        } 
        .righttools .i.icon-angle-up {
            background-image: url('https://www.join-tsinghua.edu.cn/dfiles/24262/publish/bzw2019/image/img50_1.jpg');
    }
   .righttools .i.icon-share{
    background-image: url('https://www.join-tsinghua.edu.cn/dfiles/24262/publish/bzw2019/image/img50_2.jpg');
   }
    .righttools .i {
    cursor: pointer;
    background: rgba(0, 0, 0, 0.25) center no-repeat;
    background-size: cover;
    height: 60px;
    border: rgba(255, 255, 255, 0.25) solid 1px;
    border-radius: 30px;
    }   
    </style>
</head>

<body>
    <!-- 导航条，顶部部分 -->
    <div class="head">
        <span><img src="./logo.jpg" alt="" title="清华大学本科招生"></span>
        <span class="nav1">
            <span class="kuai">
                <p><a class="name" href="https://xiaozhouyyds.gitee.io/tsinghua/" title="首页" target="_blank">首页</a>
                </p>
                <p class="zi">Home</p>
            </span>
            <span class="kuai">
                <p><a class="name" href="https://hu-jiawen123.gitee.io/tsinghua/index.html" title="国内学生"
                        target="_blank">国内学生</a></p>
                <p class="zi">Domestic</p>
                <p class="zi">Student</p>
            </span>
            <span class="kuai">
                <p><a class="name" href="https://www.join-tsinghua.edu.cn/xkdl/zszyl.htm" title="学科大类"
                        target="_blank">学科大类</a></p>
                <p class="zi">Divisions</p>
            </span>
            <span class="kuai">
                <p><a class="name" href="http://liuyayanyyds.gitee.io/lyyds" title="走进清华"
                        target="_blank">走进清华</a></p>
                <p class="zi">Campus</p>
                <p class="zi">Life</p>
            </span>
            </span>
        </span>
        <!-- 搜索小框区域 -->
        <span class="right">
            <span class="apply2"><a class="apply" title="网上报名" href="">网上报名Apply Now</a>
            </span>
            <img class="search" src="./搜索.jpg" alt="">
        </span>
    </div>

<!-- 学科大类图片及文字 -->
    <img src="./学科大类背景.jpg" alt="" width="100%">
    <span class="s2">学科大类</span>
    <span class="s1">DIVISIONS</span>
    <!-- 白底小房子加导航 -->
    <div class="bg">
        <div class="daohang">
            <img class="xiaofangzi" src="https://www.join-tsinghua.edu.cn/dfiles/24262/publish/bzw2019/image/img14.jpg"
                alt="">
            &nbsp;
            <a class="link8" href="https://www.join-tsinghua.edu.cn/index.htm">首页</a>
            &nbsp;&nbsp;&#8250;
            <a class="link8" href="https://www.join-tsinghua.edu.cn/xkdl/zszyl.htm">学科大类</a>
            &nbsp;&nbsp;&#8250;
            <a class="link8" href="https://www.join-tsinghua.edu.cn/xkdl/zszyl.htm">招生专业类</a>
        </div>
    </div>
    <!-- 招生专业类文字 -->
    <div class="xin">
        <span class="d1" href="">招生专业类</span>
    </div>
    <!-- 左右两个框，主体部分 -->
    <div>
    <div class="major">
        <h2 class="d2">招生专业类</h2>
        <p class="d3">
            经过多年的建设，清华大学已基本形成了综合性的学科布局。目前，清华大学按照16个大类进行本科招生，涵盖本科专业81个，第二学位专业18个。截至目前，清华大学共有一级学科博士、硕士学位授权点57个，仅有二级学科授权的博士、硕士学位授权点1个，仅有硕士学位授权的一级学科学位授权点7个，仅有硕士学位授权的二级学科学位授权点1个，分布在哲学、经济学、法学、教育学、文学、历史学、理学、工学、医学、管理学、艺术学等学科门类。
        </p>
        <div>
        <div class="first">
                <div class="e1">按照招生专业分类</div>
                  <div class="name2">
                    <a class="name3" href="https://www.join-tsinghua.edu.cn/info/1061/1268.htm">建筑类</a>
                   </div>
                
                   <div class="name4">
                    <a class="name3" href="https://www.join-tsinghua.edu.cn/info/1061/1270.htm">土木类</a>
                   </div>
            
                   <div class="name2">
                    <a class="name3" href="https://www.join-tsinghua.edu.cn/info/1061/1273.htm">环境、化工与新材料类</a>
                   </div>

                   <div class="name4">
                    <a class="name3" href="https://www.join-tsinghua.edu.cn/info/1061/1274.htm">机械、航空与动力类</a>
                   </div>

                   <div class="name2">
                    <a class="name3" href="https://www.join-tsinghua.edu.cn/info/1061/1276.htm">能源与电气类</a>
                   </div>
                
                   <div class="name4">
                    <a class="name3" href="https://www.join-tsinghua.edu.cn/info/1061/1277.htm">电子信息类</a>
                   </div>
            
                   <div class="name2">
                    <a class="name3" href="https://www.join-tsinghua.edu.cn/info/1061/1279.htm">计算机类</a>
                   </div>

                   <div class="name4">
                    <a class="name3" href="https://www.join-tsinghua.edu.cn/info/1061/1280.htm">自动化类</a>
                   </div>

                   <div class="name2">
                    <a class="name3" href="https://www.join-tsinghua.edu.cn/info/1061/1281.htm">数理类</a>
                   </div>
                
                   <div class="name4">
                    <a class="name3" href="https://www.join-tsinghua.edu.cn/info/1061/1282.htm">化生类</a>
                   </div>
            
                   <div class="name2">
                    <a class="name3" href="https://www.join-tsinghua.edu.cn/info/1061/1283.htm">经济、金融与管理类</a>
                   </div>

                   <div class="name4">
                    <a class="name3" href="https://www.join-tsinghua.edu.cn/info/1061/1284.htm">人文与社会类</a>
                   </div>

                   <div class="name2">
                    <a class="name3" href="https://www.join-tsinghua.edu.cn/info/1061/1285.htm">法学类</a>
                   </div>
                
                   <div class="name4">
                    <a class="name3" href="https://www.join-tsinghua.edu.cn/info/1061/1286.htm">艺术类</a>
                   </div>
            
                   <div class="name2">
                    <a class="name3" href="https://www.join-tsinghua.edu.cn/info/1061/1288.htm">文理通识类</a>
                   </div>

                   <div class="name4">
                    <a class="name3" href="https://www.join-tsinghua.edu.cn/info/1061/1290.htm">临床医学类</a>
                   </div>

                </div>
        
        <div class="second">
                <div class="e2">按照院系分类</div>
                    <div class="name2">
                        <a class="name3" href="http://www.arch.tsinghua.edu.cn/"  title="建筑学院">建筑学院</a>
                    </div>
                    <div class="name4">
                        <a class="name3" href="http://www.civil.tsinghua.edu.cn/"  title="土木水利学院">土木水利学院</a>
                    </div>
                    <div class="name2">
                        <a class="name3" href="https://www.tsinghua.edu.cn/hjxy/index.htm"  title="环境学院">环境学院</a>
                        
                    </div>
                    <div class="name4">
                        <a class="name3" href="http://www.sme.tsinghua.edu.cn/"  title="机械工程学院">机械工程学院</a>
                    </div>
                    <div class="name2">
                        <a class="name3" href="http://www.eea.tsinghua.edu.cn/" 
                                title="电机工程与应用电子技术系">电机工程与应用电子技术系</a>
                    </div>
                    <div class="name4">
                        <a class="name3" href="http://www.sist.tsinghua.edu.cn/docinfo/index.jsp" 
                                title="信息科学技术学院">信息科学技术学院</a>
                    </div>
                    <div class="name2">
                        <a class="name3" href="http://iiis.tsinghua.edu.cn/"  title="交叉信息研究院">交叉信息研究院</a>
                    </div>
                    <div class="name4">
                        <a class="name3" href="http://www.hy.tsinghua.edu.cn/"  title="航天航空学院">航天航空学院</a>
                    </div>
                    <div class="name2">
                        <a class="name3" href="http://www.ep.tsinghua.edu.cn/"  title="工程物理系">工程物理系</a>
                    </div>
                    <div class="name4">
                        <a class="name3" href="http://www.chemeng.tsinghua.edu.cn/index.do?method=list" 
                                title="化学工程系">化学工程系</a>
                    </div>
                    <div class="name2">
                        <a class="name3" href="http://www.mse.tsinghua.edu.cn/"  title="材料学院">材料学院</a>
                    </div>
                    <div class="name4">
                        <a class="name3" href="#"  title="理学院">理学院</a>
                    </div>
                    <div class="name2">
                        <a class="name3" href="http://life.tsinghua.edu.cn/"  title="生命科学学院">生命科学学院</a>
                    </div>
                    <div class="name4">
                        <a class="name3" href="http://www.med.tsinghua.edu.cn/"  title="医学院">医学院</a>
                    </div>
                    <div class="name2">
                        <a class="name3" href="#"  title="生物医学工程系">生物医学工程系</a>
                    </div>
                    <div class="name4">
                        <a class="name3" href="http://www.sps.tsinghua.edu.cn/"  title="药学院">药学院</a>
                    </div>
                    <div class="name2">
                        <a class="name3" href="#"  title="协和医学院">协和医学院</a>
                    </div>
                    <div class="name4">
                        <a class="name3" href="http://www.sem.tsinghua.edu.cn/"  title="经济管理学院">经济管理学院</a>
                    </div>
                    <div class="name2">
                        <a class="name3" href="http://www.rwxy.tsinghua.edu.cn/"  title="人文学院">人文学院</a>
                    </div>
                    <div class="name4">
                        <a class="name3" href="http://www.sss.tsinghua.edu.cn/"  title="社会科学学院">社会科学学院</a>
                    </div>
                    <div class="name2">
                        <a class="name3" href="http://www.law.tsinghua.edu.cn/"  title="法学院">法学院</a>
                    </div>
                    <div class="name4">
                        <a class="name3" href="http://www.ad.tsinghua.edu.cn/"  title="美术学院">美术学院</a>
                    </div>
                    <div class="name2">
                        <a class="name3" href="http://www.xyc.tsinghua.edu.cn/"  title="新雅书院">新雅书院</a>
                    </div>
           </div>     
         </div>   
  </div>
    <!-- 底部加图片二维码 -->
    <div class="foot">
        <div class="bingpai">
            <div class="nav">
                <img src="./本科招生网logo.jpg" alt="">
                <div class="wenzi">
                    <p>电话：010－62770334，62782051　传真：010－62782061　Email：zsb@tsinghua.edu.cn</p>
                    <p>国际招生事务：+86-10-62783100　传真：+86-10-62770837　Email：admissions@tsinghua.edu.cn</p>
                    <p>港澳台招生事务：+86-10-62799279　传真：+86-10-62770837　Email：gatzs@tsinghua.edu.cn</p>
                </div>
            </div>
            <div class="erweima">
                <img src="./二维码.jpg" alt="">
                <p class="wen">扫描二维码关注“清华招生”</p>
            </div>
        </div>
    </div>
    <div class="xiaofoot">
        <div class="baijing">
       <p>Copyright @2020 清华大学招生办公室. All Rights Reserved</p> 
       <p>地址：北京市海淀区清华园1号清华大学招生办　邮编：100084</p> 
       <a class="jing" href="https://beian.miit.gov.cn/">京ICP备15006448号-2</a>
        </div>
        <div class="link1">
        <div class="name">常用链接</div>
            
                <p><a class="a1" href="https://www.tsinghua.edu.cn" >清华大学</a></p>
                <p><a class="a1" href="http://news.tsinghua.edu.cn">清华大学新闻网</a></p>
                
            
        </div>
    </div>
    <div class="righttools">
        <div class="i icon-angle-up topA" id="toup" title="返回顶部"></div>
        <div class="i icon-share" title="分享" id="share"></div>
        <div class="sharewrapper bdsharebuttonbox" data-tag="share_1">
           
        </div>
    
</body>
</html>